import React, { forwardRef, useImperativeHandle, useRef } from 'react'

export default forwardRef(function (props, ref) {
  const testRef = useRef()
  console.log(ref) // ref就是App组件中的appRef对象
  // 在调用useImperativeHandle时,传入App中的appRef
  useImperativeHandle(ref, () => {
    // 第一个参数是一个ref对象,第二个参数是一个回调函数
    // 回调函数的返回值是什么就往第一个参数的ref对象.current上面赋值什么
    return {
      inpFocus: function () {
        // console.log('inpFocus执行了')
        testRef.current.focus()
      },
    }
  })
  return (
    <div>
      Test
      <input type="text" id="inp" ref={testRef} />
    </div>
  )
})
